<template>
<div>
  <Card :bordered="false" dis-hover>
    <div class="behind-wrapper">
      <div class="content-wrapper">
        <div class="button-group">
          <a @click='add(true)'><i class="iconfont icon-head-add"></i>新增</a>
          <!-- <a @click=''><i class="fbtn iconfont icon-head-release"></i>批量发布</a> -->
        </div>
        <div class="page-content">
          <!-- 查询 -->
          <div class="list-searchBox">
            <div class="c-line">
              <div class="w-30">
                <div class="text-input displayflex">
                  <span class="flexitem">新闻标题</span>
                  <div class="flex1">
                    <input type="text" name="price" v-model="search.Title">
                  </div>
                </div>
              </div>
              <div class="w-20" v-show="false">
                <div class="text-input displayflex">
                  <span class="flexitem">发布日期</span>
                  <div class="flex1">
                    <input type="text" name="price" v-model="search.CREATE_TIME">
                  </div>
                </div>
              </div>
              <div class="w-40">
                <div class="text-input displayflex no-border">
                  <span class="flexitem">发布状态</span>
                  <div class="flex1">
                    <div class="check_group">
                      <input type="hidden" name="radio">
                      <div class="control-filtering ">
                        <a id="all_state" class="option" value="" @click='search.IsPublish=""' :class='{"active":search.IsPublish==""}'>全部</a>
                        <a id="y_state" class="option " value="Y" @click='search.IsPublish="Y"' :class='{"active":search.IsPublish=="Y"}'>已发布</a>
                        <a id="s_state" class="option " value="N" @click='search.IsPublish="N"' :class='{"active":search.IsPublish=="N"}'>未发布</a>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="w-10 text-right fr">
                <button type="button" class="btn btn-def" @click='getData'>
                  <span class="iconfont icon-search" aria-hidden="true"></span>
                  查询
                </button>
              </div>
            </div>
          </div>
          <!-- 查询 end -->
          <div class="content-tit">
            <h2 class="h2_1 fl" style='font-size:100%;'>
              当前共<span id="id_num">{{search.total}}</span>条记录
            </h2>
          </div>
          <table class="table table-route" id="test-table">
            <thead>
              <tr>
                <!-- <th>
                  <label class="icon-checkbox">
                    <input type="checkbox"> 
                    <span>序号</span>
                  </label>
                </th> -->
                <th>序号</th>
                <th>新闻标题</th>
                <th>新闻摘要</th>
                <th>发布日期</th>
                <th>发布状态</th>
                <th>操作</th>
              </tr>
            </thead>
            <tbody>
              <tr v-for='(item,index) in list'>
                <!-- <td>
                  <label class="icon-checkbox">
                    <input type="checkbox"> 
                    <span>{{index+1}}</span>
                  </label>
                </td> -->
                <td>{{index+1}}</td>
                <td>{{item.Title}}</td>
                <td>{{item.Summary}}</td>
                <td class="not-wrap">{{item.CREATE_TIME | getYMD}}</td>
                <td>{{item.IsPublish=='Y'?'已发布':'未发布'}}</td>
                <td>
                  <div class="from-button">
                    <a class="green-button" @click='add(false, item.GUID)'>编辑</a>
                    <a class="red-button" @click="remove(item.GUID)">删除</a>
                  </div>
                </td>
              </tr>
            </tbody>
          </table>
          <Page show-total :page-size="search.PageSize" :current="search.PageIndex" :total="search.total" @on-change="changePage"></Page>
        </div>
      </div>
    </div>
  </Card>
</div>
</template>

<script>
export default {
  data() {
    return {
      list: [],
      search: {
        Title: '',
        CREATE_TIME: '',
        IsPublish: '',
        PageIndex: 1,
        pageSize: 10,
        total: 0,
        page: 1,
      },
      disabled: false,
      datas: ''
    }
  },
  mounted() {},
  methods: {
    getData() {
      var self = this;

      this.axios.post('/api/news/search', this.search)
        .then(function(res) {
          self.list = res.datas;
          self.search.total = res.total;
        })
    },
    changePage(pageNum) {
      this.search.PageIndex = pageNum;
      this.getData();
    },
    add(falg, guid) {
      var self = this;
      if (falg) {
        this.$router.push(`/behind/newsEditDetail/${falg}/00`)
      } else {
        this.$router.push(`/behind/newsEditDetail/${falg}/${guid}`)
      }
    },
    remove: function(guid) {
      const self = this;

      this.$Modal.confirm({
        title: "警告",
        closable: false,
        content: "是否确定删除？",
        onOk: () => {
          self.axios.post("/api/news/delete", {Guid: guid}).then(res => {
            if (res.success) {
              self.$Notice.success({
                title: "提示",
                desc: "删除成功！"
              });
              self.getData();
            } else {
              self.$Notice.error({
                title: "提示",
                desc: "删除失败，请稍后重试！"
              });
            }
          });
        }
      });
    }
  },
  created() {
    this.getData();
  },
  activated() {
    this.getData();
  }
}
</script>